<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>WebGL Beginner's Guide - Chapter 2 - enquiring on the state of buffers </title>

    <script type="text/javascript" src="/src/js/gl-matrix-min.js"></script>
    <script type="text/javascript" src="/src/js/utils.js"></script>
    <script type="text/javascript" src="/src/js/jquery-1.5.1.min.js"></script>
    <script type="text/javascript" src="/src/js/jquery-ui-1.8.13.custom.min.js"></script>
    <script type="text/javascript" src="/src/js/prettify.js"></script>
    <script type="text/javascript" src="/src/js/codeview.js"></script>

    <!--    Fragment Shader-->
    <script id="shader-fs" type="x-shader/x-fragment">
        #ifdef GL_ES
        precision highp float;
        #endif
        void main(void){
            gl_FragColor = vec4(0.5, 0.9, 0.2, 1.0);
        }
    </script>
    <!--    Vertex Shader-->
    <script id="shader-vs" type="x-shader/x-vertex">
        attribute vec3 aVertexPosition;

        uniform mat4 uMVMatrix;
        uniform mat4 uPMatrix;

        void main(void){
            gl_Position = uPMatrix * uMVMatrix * vec4(aVertexPosition, 1.0);
            gl_PointSize = 3.0;
        }
    </script>
</head>

<body>
<div id="top">
    <h1>WebGL Beginner's Guide - Chapter 2 - State Machine</h1>
    <h2>Getting information from WebGL with getParameter and getBufferParameter</h2>
    <div id="logo-packt"><img src="packt.gif" alt=""></div>
    <p>This example show how to recover information about the current VBO and IBO.</p>
</div>
<div id="contents">
    <div id="canvasContainer">
        <canvas id="canvas-element-id" width="480" height="400">
            Your browser does not support the HTML5 canvas element.
        </canvas>
    </div>
</div>
<div id="bottom">
    <table width="100%">
        <tr>
            <td>
                <table class="border">
                    <colgroup>
                        <col class="col1">
                        <col>
                        <col>
                        <col>
                    </colgroup>
                    <tr>
                        <th>Buffer</th>
                        <th>Name</th>
                        <th>Size</th>
                        <th>Usage</th>
                    </tr>
                    <tr>
                        <td>VBO:</td>
                        <td id="t_vbo_name"></td>
                        <td id="t_vbo_size"></td>
                        <td id="t_vbo_usage"></td>
                    </tr>
                    <tr>
                        <td>IBO:</td>
                        <td id="t_ibo_name"></td>
                        <td id="t_ibo_size"></td>
                        <td id="t_ibo_usage"></td>
                    </tr>
                </table>
            </td>
            <td>
                <p>Is vertices a VBO? <strong id="s_is_vertices_vbo"></strong></p>
                <p>Is coneVertexBuffer a VBO? <strong id="s_is_coneVertexBuffer_vbo"></strong></p>
            </td>
        </tr>
    </table>
</div>
<script>cview.run();</script>
</body>

</html>
